﻿// 等待对话框
var glWait = new GlWait();
function GlWait() {

	// 等待框html代码
	var _wait_html = ''
			+ '<div id="floatWait">'
			+ '    <div style="width: 100%; height: 100%; background-color: Black; position: fixed;'
			+ '        z-index: 9999; opacity: 0.3;left: 0; top: 0;">'
			+ '    </div>'
			+ '    <div style="width: 100%; height: 45px; left: 0; top: 50%; position: fixed; z-index: 1000;"'
			+ '        align="center">'
			+ '        <div style="padding: 10px; border-radius: 5px; line-height: 30px; background-color: Black;'
			+ '            color: White; width: 200px; display: block; opacity: 0.8; font-size:20px;">'
			+ '            <i class="fa fa-spinner fa-spin"></i>'
			+ '        </div>' + '    </div>' + '</div>';
	this.isShow = false;
	this.show = function(msg) {

		if ($("#floatWait").length < 1) {
			$("body").prepend(_wait_html);
		} else {
			$("#floatWait").css("display", "");
		}
		$("#msg").text(msg);
		if (!this.isShow) {
			this.isShow = true;
		}
	}

	this.dismiss = function() {
		this.isShow = false;
		$("#floatWait").remove();
	}
}

// 输入框
/*
 * 回调函数okClick(value)
 */
function GlInputBox(param) {
	var INPUT_ID = "inputId"; // 输入框id
	var val = param.value ? param.value : "";
	var DEFAULT_PARAM = {
		title : "请输入内容",
		body : '<input id = "' + INPUT_ID
				+ '" class = "form-control" value = "' + val
				+ '" type = "text"/>',
		cancel : {},
		ok : {
			callback : okClick
		},
		remove : false,
		onShowed : function() {

			// 模态框显示完成后让输入框 获得焦点
			$("#" + INPUT_ID).focus();
		}
	};
	var _param = $.extend({}, DEFAULT_PARAM, param);
	GlAlert(_param);

	function okClick() {
		var value = $("#" + INPUT_ID).val();
		_param.okClick(value);
	}
}

// 显示对话框
function GlAlert(param) {

	// 对话框的HTML代码
	var html = ''
			+ '<div id = "dialogModal" class="modal fade" tabindex="-1">'
			+ '  <div class="modal-dialog modal-sm"  style="margin-top:120px;">'
			+ '    <div class="modal-content">'
			+ '      <div class="modal-header" style = "padding:10px 15px;">'
			+ '        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>'
			+ '        <h4 class="modal-title">{title}</h4>'
			+ '      </div>'
			+ '      <div class="modal-body" style = "word-break: break-all;font-size: 14px;">'
			+ '        {body}' + '      </div>' + '        {foot}'
			+ '    </div>' + '  </div>' + '</div>';

	// 按钮部分html
	var footHtml = '' + '<div class="modal-footer">' + '  <div class="row">'
			+ '    {btn}' + '  </div>' + '</div>';

	// 按钮样式
	var btnHtml = ''
			+ '<div class="{btnRowCol}">'
			+ '  <button type="button" id="{btnId}" class="btn btn-{btnStyle} btn-block">{btnTxt}</button>'
			+ '</div>';

	// 默认参数
	var DEFAULT_PARAM = {
		title : "提示",
		remove : true,
		onShowed : null
	// 关闭后是否移除控件
	};

	// 确认按钮默认参数
	var OK_PARAM = {
		id : "btnOkId",
		txt : "确认",
		style : "primary"
	};

	// 取消按钮默认参数
	var CANCEL_PARAM = {
		id : "btnCancelId",
		txt : "取消",
		style : "default"
	};

	// 如果传入的参数是一个字符串类型 则直接当做弹出框的内容 其他默认
	if (typeof param != "object") {
		var temp = param + "";
		// 如果传入的是一个字符串类型
		param = {};
		param.body = temp;
	}

	// 合并对象
	var _param = $.extend({}, DEFAULT_PARAM, param);

	if ($("#dialogModal").length > 0) {
		$("#dialogModal").remove();
	}

	var _html = html.replace(/{title}/, _param.title).replace(/{body}/,
			_param.body)

	// 如果有按钮
	if (_param.ok != null || _param.cancel != null) {
		_html = _html.replace(/{foot}/, footHtml);

		if (_param.ok != null) {

			// 合并参数
			_param.ok = $.extend({}, OK_PARAM, _param.ok);
		}
		if (_param.cancel != null) {

			// 合并参数
			_param.cancel = $.extend({}, CANCEL_PARAM, _param.cancel);
		}

		// 只有确认按钮
		if (_param.ok != null && _param.cancel == null) {
			_html = _html.replace(/{btn}/, btnHtml.replace(/{btnRowCol}/,
					"col-xs-12").replace(/{btnId}/, _param.ok.id).replace(
					/{btnStyle}/, _param.ok.style).replace(/{btnTxt}/,
					_param.ok.txt));
		}
		// 只有取消按钮
		else if (_param.ok == null && _param.cancel != null) {
			_html = _html.replace(/{btn}/, btnHtml.replace(/{btnRowCol}/,
					"col-xs-12").replace(/{btnId}/, _param.cancel.id).replace(
					/{btnStyle}/, _param.cancel.style).replace(/{btnTxt}/,
					_param.cancel.txt));
		}
		// 两个按钮都有
		else {
			_html = _html.replace(/{btn}/, btnHtml.replace(/{btnRowCol}/,
					"col-xs-6").replace(/{btnId}/, _param.ok.id).replace(
					/{btnStyle}/, _param.ok.style).replace(/{btnTxt}/,
					_param.ok.txt)
					+ btnHtml
							.replace(/{btnRowCol}/, "col-xs-6")
							.replace(/{btnId}/, _param.cancel.id).replace(
									/{btnStyle}/, _param.cancel.style).replace(
									/{btnTxt}/, _param.cancel.txt));
		}
	} else {
		_html = _html.replace(/{foot}/, "");
	}

	// 添加html代码
	$("body").prepend(_html);

	$('#dialogModal').modal({
		keyboard : false
	});

	// 此事件在模态框已经显示出来（并且同时在 CSS 过渡效果完成）之后被触发。
	$('#dialogModal').on('shown.bs.modal', function(e) {
		if (_param.onShowed != null) {
			_param.onShowed();
		}
	});

	$("#dialogModal").modal("show");

	if (_param.ok != null) {
		$("#" + _param.ok.id).on("click", okClick);
	}

	if (_param.cancel != null) {
		$("#" + _param.cancel.id).on("click", cancelClick);

		// 设置所有的关闭事件为用户自定义的取消事件
		_param.onClose = _param.cancel.callback;
	}

	// 对话框关闭事件 点击了确认按钮事件时该事件被覆盖
	$('#dialogModal').on('hidden.bs.modal', function(e) {
		$("#dialogModal").remove();
		if (_param.onClose != null) {
			_param.onClose();
		}
	});

	// 确认键点击事件
	function okClick() {

		// 关掉默认的关闭事件
		$('#dialogModal').off('hidden.bs.modal');

		// 等待模态框消失之后执行事件
		$('#dialogModal').on('hidden.bs.modal', function(e) {
			if (_param.remove) {
				$("#dialogModal").remove();
			}
			_param.ok.callback();
		});
		$("#dialogModal").modal("hide");

	}

	// 取消键点击事件
	function cancelClick() {

		// 关掉默认的关闭事件
		$('#dialogModal').off('hidden.bs.modal');

		// 等待模态框消失之后执行事件
		$('#dialogModal').on('hidden.bs.modal', function(e) {
			$("#dialogModal").remove();
			if (_param.cancel.callback != null) {
				_param.cancel.callback();
			}
		});
		$("#dialogModal").modal("hide");

	}
}

function GlToast(param) {

	// 提示框的html代码
	var TOAST_HTML = ''
			+ '<div class="modal fade toast-tag" id="{id}" tabindex="-1" role="dialog" style = "z-index:9999">'
			+ '    <div class="modal-dialog modal-sm" style="margin-top: 120px;">'
			+ '        <div class="modal-content" style = "margin:0 40px">'
			+ '            <div class="modal-body text-center" style="word-break: break-all;">{body}</div>'
			+ '        </div>' + '    </div>' + '</div>';

	// 默认参数
	var DEFAULT_PARAM = {
		time : 1500
	// 模态框消失时间 毫秒
	};

	// 如果传入的参数是一个字符串类型 则直接当做弹出框的内容 其他默认
	if (typeof param != "object") {
		var temp = param + "";

		// 如果传入的是一个字符串类型
		param = {};
		param.body = temp;
	}

	// 合并对象
	var _param = $.extend({}, DEFAULT_PARAM, param);
	if ($(".toast-tag").length > 0) {
		$(".toast-tag").remove();
	}

	// 随机id
	var randId = "toastId" + parseInt(Math.random() * 100);
	var _html = TOAST_HTML.replace(/{id}/, randId).replace(/{body}/,
			_param.body);

	// 添加html代码
	$("body").prepend(_html);

	$("#" + randId).modal("show");

	// 模态框消失后的事件
	$("#" + randId).on('hidden.bs.modal', function(e) {
		$(".toast-tag").remove();
		if (_param.onClose != null) {
			_param.onClose();
		}
	});

	// 指定时间内消失
	setTimeout(function() {
		$("#" + randId).modal("hide");
	}, _param.time);

}
